<template>
  <!-- 仓库列表 -->
  <div class="Right">
    <RepoSearch @getKeyword="getKeyword" />
    <RepoList :repoList="repoList" />
  </div>
</template>

<script>
import RepoSearch from "./repoSearch.vue";
import RepoList from "./repoList.vue";
import { getRepoList,getRepoListBykeyword } from "../api/repo";
export default {
  components: {
    RepoList,
    RepoSearch,
  },
  props: {
    userId: "",
  },
  

  watch: {
    keyword(n, o) {
      console.log(n);
    },
  },

  data() {
    return {
      keyword: "",
      repoList: [],
    };
  },

  watch: {
    userId(newVal, oldVal) {
      this.repoList = getRepoList(newVal);
    },
  },

  created() {
    this.repoList = getRepoList();
  },

  methods: {
    getRepoList() {
      this.repoList = getRepoList(this.userId);
    },
    getKeyword(keyword) {
      this.repoList = getRepoListBykeyword(keyword);
    },
  },
};
</script>


<style scoped>
</style>